import {LANG} from '../../../config/config.js';
import {NavPages, Select} from '../../../components/components.js';

class orderDetails extends React.Component {
  constructor(props){
    super(props);
    console.log(props.routeParams.ID);
    this.state = {
      gander: 1
    }
    this.editGanderClick = this.editGanderClick.bind(this);
  }


  editGanderClick(E) {
    if (E.target.nodeName === "LABEL") {
      this.setState({
        gander: E.target.innerHTML === '男' ? 1 : 0
      })
    }
  }


  render() {
    return (
      <div className="container-fluid orderDetails">
        <NavPages nav={[LANG[Lang].home, LANG[Lang].orderManagement, LANG[Lang].orderDetails]}></NavPages>
        <table  className="table table-bordered">
          <tbody>
            <tr>
              <td>{LANG[Lang].name}</td>
              <td><input type="text" className="form-control"/></td>
              <td>{LANG[Lang].patientGender}</td>
              <td onClick={this.editGanderClick}>
                <label className={this.state.gander ? 'input-radio active' : 'input-radio'}>男</label>
                <label className={this.state.gander ? 'input-radio' : 'input-radio active'}>女</label>
              </td>
              <td>{LANG[Lang].age}</td>
              <td><input type="text" className="form-control"/></td>
              <td>{LANG[Lang].phoneNumber}</td>
              <td><input type="text" className="form-control"/></td>
            </tr>
            <tr>
              <td>{LANG[Lang].identificationNumber}</td>
              <td colSpan='3'><input type="text" className="form-control"/></td>
              <td>{LANG[Lang].email}</td>
              <td colSpan='3'><input type="text" className="form-control"/></td>
            </tr>
            <tr>
              <td>{LANG[Lang].deliveryAddress}</td>
              <td colSpan='7'><input type="text" className="form-control"/></td>
            </tr>
            <tr>
              <td>{LANG[Lang].curativeWffect}</td>
              <td colSpan='7'><textarea className="form-control"></textarea></td>
            </tr>
            <tr>
              <td>{LANG[Lang].doctor}</td>
              <td><input type="text" className="form-control"/></td>
              <td>{LANG[Lang].doctorPhone}</td>
              <td><input type="text" className="form-control"/></td>
              <td rowSpan='2'>{LANG[Lang].clinicalDiagnosis}</td>
              <td rowSpan='2' colSpan='3'><textarea className="form-control"></textarea></td>
            </tr>
            <tr>
              <td>{LANG[Lang].checkHospital}</td>
              <td><input type="text" className="form-control"/></td>
              <td>{LANG[Lang].inspectionDepartment}</td>
              <td><input type="text" className="form-control"/></td>
            </tr>
            <tr>
              <td>{LANG[Lang].sampleType}</td>
              <td><Select disabled={true} option={[{name: '切片', value: '切片'},{name: '切片', value: '切片'},{name: '切片', value: '切片'},{name: '切片', value: '切片'}]}/></td>
              <td>{LANG[Lang].samplingTime}</td>
              <td><input type="text" className="form-control"/></td>
              <td>{LANG[Lang].samplingAddress}</td>
              <td colSpan='3'><input type="text" className="form-control"/></td>
            </tr>
            <tr>
              <td>{LANG[Lang].photo}</td>
              <td colSpan='7'></td>
            </tr>
          </tbody>
        </table>
      </div>
    )
  }
}

module.exports = orderDetails;
